<template>
  <div>
    <template v-if="user">
      <van-cell title="用户名" is-link :value="user.username" @click="toEdit('username','用户名',user.username)" />
      <van-cell title="账号" is-link :value="user.userAccount" />
      <van-cell title="头像" is-link :value="user.avatarUrl">
        <img :src="user.avatarUrl" style="height: 40px" />
      </van-cell>
      <van-cell title="性别" is-link :value="user.gender" @click="toEdit('gender','性别',user.gender)" />
      <van-cell title="电话" is-link :value="user.phone" @click="toEdit('phone','电话',user.phone)" />
      <van-cell title="邮箱" is-link :value="user.email" />
      <van-cell title="注册时间" is-link :value="user.createTime" />
    </template>
  </div>
</template>

<script setup lang="ts">

import {useRoute, useRouter} from "vue-router";
import {onMounted, ref} from "vue";
import myAxios from "../request/myAxios";
import {Toast} from "vant";
import {getCurrentUser} from "../states/user";

const router = useRouter()
const user = ref({})
onMounted(async ()=>{
  user.value = await getCurrentUser()
})

const toEdit = (editKey:string,editName:string,currentValue:string)=>{
  router.push({
    path:'/user/edit',
    query:{
      editKey,
      currentValue,
      editName,
    },
  })
}
</script>

<style scoped>

</style>
